import 'package:environmental_les_app/common/style/colours.dart';
import 'package:environmental_les_app/common/widgets/rich_text.dart';
import 'package:environmental_les_app/page/main/widgets/surrounding_units_item.dart';
import 'package:flutter_clx_base/flutter_clx_base.dart';

import 'index.dart';

class SurroundSearchPage extends GetView<SurroundSearchController> {
  const SurroundSearchPage({super.key});

  // 主视图
  Widget _buildView() {
    // 演示数据（如果 controller 提供真实数据，可替换）

    return SafeArea(
      child: SingleChildScrollView(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // 顶部空间, 与背景图片叠加
            const MyPageAppBar(
              title: "",
              backgroundColor: Colors.transparent,
              actions: [
                Padding(
                  padding: EdgeInsets.symmetric(
                    horizontal: 16,
                  ),
                  child: Row(
                    children: [
                      Icon(Icons.location_on, color: Colours.appMain),
                      hGap5,
                      Text('淮格尔市',
                          style: TextStyle(
                              color: Colours.text254,
                              fontSize: 18,
                              fontWeight: FontWeight.w500)),
                      hGap10,
                      Text('重新定位',
                          style:
                              TextStyle(color: Colours.appMain, fontSize: 15)),
                    ],
                  ),
                )
              ],
            ),

            // 搜索区
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Row(
                children: [
                  InkWell(
                    onTap: () {},
                    child: const Row(
                      children: [
                        Text('周边',
                            style: TextStyle(
                                color: Colours.textC4C,
                                fontSize: 15,
                                fontWeight: FontWeight.bold)),
                        SizedBox(width: 6),
                        Text('2KM',
                            style: TextStyle(
                                color: Colours.appMain,
                                fontWeight: FontWeight.bold)),
                        Icon(Icons.keyboard_arrow_down, color: Colours.textC4C),
                      ],
                    ),
                  ),
                  const SizedBox(width: 12),
                  Expanded(
                    child: Container(
                      height: 40,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(6),
                      ),
                      padding: const EdgeInsets.symmetric(horizontal: 12),
                      child: const Row(
                        children: [
                          Icon(Icons.search, color: Colours.text969),
                          SizedBox(width: 8),
                          Expanded(
                              child: Text('在淮格尔旗中搜索',
                                  style: TextStyle(color: Colours.textC9CDD4))),
                        ],
                      ),
                    ),
                  ),
                ],
              ),
            ),

            const SizedBox(height: 10),
            const Padding(
              padding: EdgeInsets.symmetric(horizontal: 16),
              child: RichTextWidget(
                children: [
                  TextSpan(
                      text: '共找到 ',
                      style: TextStyle(color: Colours.text09C, fontSize: 14)),
                  TextSpan(
                      text: '5685',
                      style: TextStyle(
                          color: Colours.appMain,
                          fontSize: 14,
                          fontWeight: FontWeight.bold)),
                  TextSpan(
                      text: ' 个结果',
                      style: TextStyle(color: Colours.text09C, fontSize: 14)),
                ],
              ),
            ),

            const SizedBox(height: 12),

            // 筛选行
            const Padding(
              padding: EdgeInsets.symmetric(horizontal: 16),
              child: Row(
                children: [
                  Expanded(
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text('行业',
                            style: TextStyle(
                                color: Colours.appMain, fontSize: 14)),
                        SizedBox(width: 6),
                        Icon(Icons.arrow_drop_down, color: Colours.appMain),
                      ],
                    ),
                  ),
                  SizedBox(width: 12),
                  Expanded(
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text('重点排污单位',
                            style: TextStyle(
                                color: Colours.text969, fontSize: 14)),
                        SizedBox(width: 6),
                        Icon(Icons.arrow_drop_down, color: Colours.text969),
                      ],
                    ),
                  ),
                ],
              ),
            ),

            const SizedBox(height: 16),

            // 列表
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Column(
                children: controller.dataList.map((data) {
                  return SurroundingUnitsItem(data: data);
                }).toList(),
              ),
            ),

            const SizedBox(height: 40),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<SurroundSearchController>(
      init: SurroundSearchController(),
      id: "surround_search",
      builder: (_) {
        return Scaffold(
          body: Stack(
            children: [
              Container(
                height: 200,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage(ImageUtils.getImgPath('bg_title_top')),
                    fit: BoxFit.cover,
                  ),
                ),
              ),
              _buildView(),
            ],
          ),
        );
      },
    );
  }
}
